<!--  -->
<template>
  <div>
    <div v-if="userInfo.Administrator == 0">
      <a-tabs default-active-key="1" @change="callback">
        <a-tab-pane key="1" tab="管理员"> </a-tab-pane>
        <a-tab-pane key="2" tab="待审核" force-render> </a-tab-pane>
      </a-tabs>
      <a-table
        :columns="columns"
        :data-source="data"
        style="height: 100%"
        :rowKey="
          (record, index) => {
            return record.brNo + '-' + index;
          }
        "
        :loading="loading"
        :pagination="ipagination"
      >
        <p slot="expandedRowRender" slot-scope="record" style="margin: 0">
          <span style="font-weight: 800"> 申请理由：</span>{{ record.reason }}
        </p>
        <span slot="action" slot-scope="text, record" class="actone">
          <a-popconfirm
            title="确定审核通过？"
            ok-text="确定"
            cancel-text="取消"
            @confirm="confirm(record, '1')"
            @cancel="cancel"
            v-if="!record.Administrator && record.Administrator != '1'"
          >
            <a-icon type="check" title="审核" />
          </a-popconfirm>
          <a-popconfirm
            title="确定取消管理员？"
            ok-text="确定"
            cancel-text="取消"
            @confirm="confirm(record, '2')"
            @cancel="cancel"
            v-if="record.Administrator && record.Administrator == '1'"
          >
            <a-icon type="close" title="取消管理员" />
          </a-popconfirm>
        </span>
      </a-table>
    </div>
    <div v-if="userInfo.Administrator != 0" class="imgbox">
      <img src="../../assets/403.png" alt="" />
    </div>
  </div>
</template>

<script>
import { requset } from "@/api";
export default {
  name: "",
  data() {
    return {
      loading: false,
      data: [],
      columns: [
        {
          title: "用户名",
          dataIndex: "userName",
          align: "center",
          key: "userName",
        },

        {
          title: "手机号",
          dataIndex: "phone",
          align: "center",
          key: "phone",
        },
        {
          title: "状态",
          dataIndex: "status",
          align: "center",
          key: "status",
          customRender: (memStatus) => {
            switch (memStatus) {
              case "":
                return "";
              default:
                return "待审核";
            }
          },
        },
        {
          title: "注册时间",
          dataIndex: "createUserDate",
          align: "center",
          key: "createUserDate",
          customRender: (memStatus) => {
            switch (memStatus) {
              case "0":
                return "";
              default:
                return "暂无";
            }
          },
        },
        {
          title: "操作",
          key: "action",
          align: "center",
          scopedSlots: { customRender: "action" },
        },
      ],
      status: "",
      ipagination: {
        current: 1,
        pageSize: 10,
        pageSizeOptions: ["5", "10", "15"],
        showTotal: (total, range) => {
          return range[0] + "-" + range[1] + " 共" + total + "条";
        },
        showQuickJumper: true,
        showSizlevelServiceModalhanger: true,
        total: 0,
        onChange: (pageIndex) => {
          this.ipagination.current = pageIndex;
          this.getlist();
        },
        onShowSizlevelServiceModalhange: (current, pageSize) => {
          console.log(current, pageSize);
          this.ipagination.pageSize = pageSize;
          this.ipagination.current = 1;
          this.getlist();
        },
      },
      userInfo: JSON.parse(localStorage.getItem("userInfo")),
    };
  },
  //生命周期 - 创建完成（访问当前this实例）
  created() {},
  //生命周期 - 挂载完成（访问DOM元素）
  mounted() {
    this.getlist();
  },
  //事件方法
  methods: {
    shUser(item) {},
    callback(key) {
      this.status = key;
      this.getlist();
    },
    getlist() {
      let params = {
        pageSize: this.ipagination.pageSize,
        pageIndex: this.ipagination.current,
        status: this.status,
      };
      this.loading = true;
      requset("post", "/Administrator/adminlist", params).then((res) => {
        if (res.data.code == 200) {
          this.data = res.data.data;
          this.ipagination.total = res.data.count;
          this.loading = false;
        } else {
          this.$message.error(res.data.msg);
        }
      });
    },
    confirm(e, i) {
      this.loading = true;
      requset("post", "/Administrator/auditadmin", {
        userId: e.userId,
        status: i,
      }).then((res) => {
        if (res.data.code == 200) {
          this.$message.success(res.data.msg);
          this.loading = false;
          this.getlist();
        } else {
          this.$message.error(res.data.msg);
        }
      });
    },
    cancel(e) {},
  },
};
</script>
<style scoped>
/* @import url(); 引入css类 */
.actone {
  color: #1890ff;
  font-size: 15px;
  cursor: pointer;
}
.imgbox {
  display: flex;
  justify-content: center;
}
.imgbox img {
  width: 60%;
}
</style>
